<template>
	<div class="container">
		<el-page-header @back="goBack" content="台账查询"></el-page-header>

		<el-radio-group v-model="dataType" class="e-m-t-45">
			<el-radio-button label="0">入库台账</el-radio-button>
			<el-radio-button label="1">出库台账</el-radio-button>
			<el-radio-button label="2">学校台账</el-radio-button>


		</el-radio-group>

		<el-row type="flex" justify="space-between" class="nav-bar">
			<el-col :span="3">
				<el-button type="primary" @click="downloadwithdrawa()" plain><i
						class="iconfont icon-excel e-m-r-5"></i>导出Excel</el-button>
			</el-col>
			<el-col class="text-right">
				<el-form :inline="true" label-width="auto" class="nav-bar-form">
					<el-form-item label="下单时间">
						<el-date-picker @change="time" :clearable="false" value-format="yyyy-MM-dd" v-model="value1"
							type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" clearable>
						</el-date-picker>
					</el-form-item>
					<el-form-item>
						<el-input placeholder="关键词搜索" v-model="key" clearable prefix-icon="el-icon-search"
							@clear="getList"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="getList">查询</el-button>
					</el-form-item>
				</el-form>
			</el-col>
		</el-row>

		<el-table :data="tableData" style="width: 100%" stripe>
			<el-table-column fixed prop="number" label="订单编号" width="200">
			</el-table-column>
			<el-table-column label="用户名称">
                <template slot-scope="scope">
                    {{scope.row.username?scope.row.username:scope.row.brothername}}
                </template>
			</el-table-column>
			<el-table-column prop="typeNames" label="废品类型" width="150">
			</el-table-column>
			<el-table-column prop="productName" label="废品小类" width="150">
			</el-table-column>
			<el-table-column prop="weight" label="重量（KG）" width="150">
                <template slot-scope="scope">
                    <span>{{ scope.row.weight }}KG</span>
                </template>
			</el-table-column>
			<el-table-column prop="quantity" label="数量（件）" width="150">
                <template slot-scope="scope">
                    <span>{{ scope.row.quantity }}件</span>
                </template>
			</el-table-column>
			<el-table-column prop="sellprice" label="出库单价" width="150">
			</el-table-column>
			<el-table-column prop="sellamount" label="出库总价" width="150">
			</el-table-column>
            <el-table-column prop="storename" label="出库站点" width="150">
			</el-table-column>
            <!-- <el-table-column prop="ordertype" label="订单类型" width="150">
			</el-table-column> -->
            <el-table-column prop="delivertime" label="出库时间" width="150">
			</el-table-column>
			<!-- <el-table-column prop="paystate" label="支付状态" width="100">
				<template slot-scope="scope">
					<span class="color-success" v-if="scope.row.paystate == '已支付'">已支付</span>
				</template>
			</el-table-column> -->
            <!-- <el-table-column prop="state" label="状态" width="100">
				<template slot-scope="scope">
					<span class="color-warning" v-if="scope.row.state == '待入库'">待入库</span>
					<span class="color-danger" v-if="scope.row.state == '已取消'">已取消</span>
					<span class="color-success" v-if="scope.row.state == '已入库'">已入库</span>
				</template>
			</el-table-column> -->
			<!-- <el-table-column label="操作" fixed="right" width="180">
				<template slot-scope="scope">
					<el-button @click="views(scope.row.id)" type="text" size="small">查看</el-button>
					<el-button @click="pass(scope.row.id)" type="text" size="small"
						v-if="scope.row.state == '待审核'">打款</el-button>
					<el-button @click="reject(scope.row.id)" type="text" size="small"
						v-if="scope.row.state == '待审核' || scope.row.state == '打款出错'">驳回</el-button>
				</template>
			</el-table-column> -->
		</el-table>
		<div class="table-pagination">
			<el-pagination background layout="sizes, total, prev, pager, next" :total="total"
				:page-sizes="[10, 50, 100, 200]" :page-size="pageSize" :current-page="page" @current-change="pageChange"
				@size-change="handleSizeChange">
			</el-pagination>
		</div>
	</div>
</template>

<script>
export default {
	layout: 'admin',
	head() {
		return {
			title: '出库台账' 
		}
	},
	data() {
		return {
			timeType: 0,
			loading: true,
			value1: "",//下单时间
			starteate: "",//下单初始
			enddate: "",//下单结束
			dataType: 1,
			key: '',
			page: 1,
			pageSize: 10,
			status: 1,
			loading: false,
			total: 0,
			dialogVisible: false,
			dialogVisible2: false,
			tableData: [],
		}
	},
	watch: {
		dataType(val) {
			console.log(val)
			if (val == 0) {
				this.$router.push({
					path: '/ledger/brotherOrder'
				})
			}
			 else if (val == 2) {
				this.$router.push({
					path: '/ledger/schoolOrder'
				})
			}
			else {
				this.$router.push({
					path: '/ledger/storeOrder'
				})
			}
		}
	},
	mounted() {
		this.getList()
	},
	methods: {
		downloadwithdrawa() {
			this.$axios.post('/Store/OutOrder/LedgerDownload', {
				"request": {
					"pageIndex": this.page,
					"pageSize": 0,
					"offset": 0,
					"key": "",
					"startDate": this.startdate,
					"endDate": this.enddate,
					"state": this.state,
					"packStationId": 0,
					"OrderType": this.Ordertype,
					"timeType": this.timeType
				},
				"fields": [
					{
						"e": "number",
						"c": "订单编号"
					},
					{
						"e": "username",
						"c": "用户名称"
					},
                    {
						"e": "brothername",
						"c": "小哥名称"
					},
					{
						"e": "typeNames",
						"c": "废品类型"
					},
					{
						"e": "ProductName",
						"c": "废品小类"
					},
                    {
						"e": "weight",
						"c": "数量"
					},
                    {
						"e": "price",
						"c": "单价"
					},
                    {
						"e": "amount",
						"c": "总价"
					},
                    {
						"e": "ordertype",
						"c": "订单类型"
					},
                    {
						"e": "createddatetime",
						"c": "下单时间"
					},
                    {
						"e": "state",
						"c": "状态"
					},
				]

			}, {
				responseType: 'blob'
			}).then(res => {
				console.log(res)
				let content = res;
				let fileName = '出库台账.xls'
				this.utils.saveAndExport(content, fileName)
			})
		},
		time(e) {
			console.log(e)
            if(e){
                this.startdate = e[0]
                this.enddate = e[1]
                this.timeType = 4
            }else{
                this.startdate = ''
                this.enddate = ''
                this.timeType = 0
            }
            this.getList()
		},
		goBack() {
			this.$router.go(-1)
		},
		getList() {
			this.loading = true
			this.$axios.post('/Store/OutOrder/Ledger', {
				"PageIndex": this.page,
				"PageSize": this.pageSize,
				"Key": this.key,
				"RelationId": this.relationid,
				"timeType": this.timeType,
				"startDate": this.startdate,
				"endDate": this.enddate
			}).then((res) => {
				this.tableData = res.rows;
				this.total = res.total;
				this.loading = false
			}).catch(() => {
				this.loading = false
			})
		},
		search() {
			this.getList()
		},
		pageChange(e) { // 页码切换事件
			this.page = e;
			this.getList()
		},
		handleSizeChange(val) {
			this.page = 1;
			this.pageSize = val;
			this.getList()
		}
	}
}
</script>

<style lang="scss" scoped>
.process {}

.nav-bar {
	padding: 45px 0 0;
}

.send {
	margin-top: 15px;
	margin-right: 10px;
}

.dialogForm {
	display: flex;
	flex-wrap: wrap;

	.el-form-item {
		width: 50%;
		float: left;

		&.all {
			width: 100%;
		}

		.el-select {
			width: 100%;
		}
	}
}</style>
